<template>
  <el-table-column
    v-bind="useAttrs()"
    style="width: 100%"
    show-overflow-tooltip
    class-name="hs-table-column"
  >
    <template #default="{ row, column }" v-if="!attrs.type || attrs.type === 'default'">
      <slot :row="row" :column="column">
        <hs-table-cell :cellType="_fieldType" :row="row" :column="column" />
      </slot>
    </template>
  </el-table-column>
</template>

<script setup>
import { ElTableColumn } from 'element-plus'
import { computed, ref, useAttrs } from 'vue'
import HsTableCell from './TableCell.vue'
const attrs = useAttrs()
const props = defineProps({
  fieldType: {
    type: String,
    default: 'input',
    validator: (value) => {
      return ['input', 'address', 'map', 'date', 'time', 'daterange', 'tag', 'promise'].includes(
        value,
      )
    },
  },
})

const _fieldType = props.fieldType
</script>

<style lang="scss">
.hs-table-column {
  height: 44px;
  .el-tooltip {
    height: 100%;
  }
}
</style>
